// 确保DOM完全加载后再执行JS代码
$(document).ready(function() {
  // 页面加载完成后隐藏加载动画，显示忘记密码表单
  setTimeout(function() {
    $('#loadingScreen').addClass('hidden');
    $('#forgotContainer').addClass('visible');
  }, 2000); // 2秒后显示忘记密码页面

  // 用户名输入框失去焦点时获取密保问题
  // 用户名输入框失去焦点时获取密保问题
$('#username').blur(function() {
    let username = $(this).val().trim();
    
    if (username === '') {
        $('#security-question').val('');
        $('#security-question-hint').text('请输入用户名后，密保问题将自动显示在这里');
        return;
    }
    
    console.log('正在获取密保问题，用户名:', username);
    
    // 显示加载状态
    $('#security-question').val('正在加载密保问题...');
    $('#security-question-hint').text('正在查询密保问题，请稍候');
    
    // 发送请求获取密保问题
    $.ajax({
        url: '/security-question',
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify({
            username: username
        }),
        success: function(response) {
            console.log('收到响应:', response);
            
            if (response.success && response.securityQuestion) {
                console.log('设置密保问题:', response.securityQuestion);
                $('#security-question').val(response.securityQuestion);
                $('#security-question-hint').text('密保问题已加载');
                $('#security-question-error').hide();
            } else {
                console.log('获取密保问题失败:', response.message);
                $('#security-question').val('');
                $('#security-question-hint').text('无法获取密保问题');
                $('#security-question-error').text(response.message).show();
            }
        },
        error: function(xhr, status, error) {
            console.error('请求失败:', status, error);
            console.log('响应文本:', xhr.responseText);
            $('#security-question').val('');
            $('#security-question-hint').text('获取密保问题失败');
            $('#security-question-error').text('网络错误，无法获取密保问题').show();
            showMessage('error', '网络错误，无法获取密保问题');
        }
    });
});


  // 表单提交事件
  $('#forgot-form').submit(function(e) {
    e.preventDefault();
    
    let username = $('#username').val();
    let securityAnswer = $('#security-answer').val();
    let newPassword = $('#new-password').val();
    let confirmPassword = $('#confirm-password').val();
    
    // 重置错误状态
    $('.error-message').hide();
    $('input').removeClass('error');
    
    // 前端验证
    let hasError = false;
    
    if (username === '') {
      $('#username-error').text('请输入用户名').show();
      $('#username').addClass('error');
      hasError = true;
    }
    
    if ($('#security-question').val() === '') {
      $('#security-question-error').text('请先输入有效的用户名获取密保问题').show();
      hasError = true;
    }
    
    if (securityAnswer === '') {
      $('#security-answer-error').text('请输入密保答案').show();
      $('#security-answer').addClass('error');
      hasError = true;
    }
    
    if (newPassword === '') {
      $('#new-password-error').text('请输入新密码').show();
      $('#new-password').addClass('error');
      hasError = true;
    } else if (newPassword.length < 6) {
      $('#new-password-error').text('密码长度至少为6个字符').show();
      $('#new-password').addClass('error');
      hasError = true;
    }
    
    if (confirmPassword === '') {
      $('#confirm-password-error').text('请确认新密码').show();
      $('#confirm-password').addClass('error');
      hasError = true;
    } else if (newPassword !== confirmPassword) {
      $('#confirm-password-error').text('两次输入的密码不一致').show();
      $('#confirm-password').addClass('error');
      hasError = true;
    }
    
    if (hasError) {
      return;
    }
    
    // 显示加载状态
    $('#submit').prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> 重置中...');
    
    // 发送重置密码请求
    $.ajax({
      url: '/reset-password-by-security',
      type: 'POST',
      contentType: 'application/json',
      data: JSON.stringify({
        username: username,
        securityAnswer: securityAnswer,
        newPassword: newPassword,
        confirmPassword: confirmPassword
      }),
      success: function(response) {
        // 恢复按钮状态
        $('#submit').prop('disabled', false).html('重置密码');
        
        if (response.success) {
          showMessage('success', response.message);
          // 跳转到登录页面
          setTimeout(function() {
            window.location.href = 'login.html';
          }, 2000);
        } else {
          showMessage('error', response.message);
          // 根据错误类型显示不同的提示
          if (response.message.includes('密保答案错误')) {
            $('#security-answer-error').text('密保答案错误').show();
            $('#security-answer').addClass('error');
          }
        }
      },
      error: function() {
        $('#submit').prop('disabled', false).html('重置密码');
        showMessage('error', '网络错误，请稍后重试');
      }
    });
  });
  
  // 输入时清除错误状态
  $('input').on('input', function() {
    $(this).removeClass('error');
    $(this).siblings('.error-message').hide();
  });
  
  // 自定义消息提示函数
  function showMessage(type, message) {
    // 移除可能已存在的消息
    $('.custom-message').remove();
    
    // 创建消息元素
    const messageEl = $('<div class="custom-message"></div>')
      .text(message)
      .addClass(type === 'success' ? 'success-message' : 'error-message');
    
    // 添加到页面
    $('body').append(messageEl);
    
    // 显示消息
    setTimeout(function() {
      messageEl.addClass('show');
    }, 10);
    
    // 自动隐藏消息
    setTimeout(function() {
      messageEl.removeClass('show');
      setTimeout(function() {
        messageEl.remove();
      }, 300);
    }, 4000);
  }
});